<template>
	<div class="m-companyView">
		<div class="m-agTable">
			<agGridComponents
				ref="agGridComponent"
				:getColumnDefs="columnDefs"
				:getRowSelection="'single'"
				:getGridOptions="gridOptions"
				:getRowData="tableData"
				:isColFit="true"
			></agGridComponents>
		</div>
	</div>
</template>

<script>
import Vue from "vue"
import agGridComponents from "@/components/agGridComponents"

const operator = Vue.extend({
	template: `<el-checkbox v-model="checked" @change="valueChange"></el-checkbox>`,
	data () {
		return {
			checked: false
		}
	},
	methods: {
		valueChange (val) {
			this.params.data.signMode = val ? 1 : 0
			//   this.params.context.componentParent.setRowData(this.params.data, val)
		}
	},
	created () {
		const { signMode } = this.params.data
		this.checked = signMode == 1
	}
})
export default {
	data () {
		return {
			columnDefs: [],
			gridOptions: {},
			params: []
		}
	},
	props: {
		tableData: {
			type: Array
		}
	},
	methods: {
		setRowData (nodeData, value) {
			//   this.$refs['agGridComponent'].gridOptions.api
			let signMode = value ? 1 : 0
			this.params = []
			this.tableData.forEach(item => {
				if (item.id == nodeData.id) {
					item.signMode = signMode
				}
				this.params.push({
					id: item.id,
					signMode: item.signMode,
					modifyerId: this.$global.user.id,
					modifyer: this.$global.user.loginName
				})
			})
		},
		getValidator () {
			this.params = []
			this.tableData.forEach(item => {
				this.params.push({
					id: item.id,
					signMode: item.signMode,
					modifyerId: this.$global.user.id,
					modifyer: this.$global.user.loginName
				})
			})
			console.log('biaoge', this.tableData)
			this.$emit("setRuleFormData", this.params)
		}
	},
	components: {
		agGridComponents
	},
	beforeMount () {
		this.gridOptions = {
			context: {
				componentParent: this
			},
			defaultColDef: {
				menuTabs: []
			},
			enableColResize: true,
			suppressContextMenu: true, //取消右键显示菜单
			enableFilter: false, //允许过滤(可以插入自定义过滤控件)
			multiSortKey: 'ctrl', //多列排序
			enableSorting: false, //列排序
			animateRows: true, //排序动画
			suppressRowClickSelection: true //单元格选中,false为选中整行
		}
		this.columnDefs = [
			{ headerName: "公司编号", field: "companyCode", width: 100, tooltipField: 'companyCode' },
			{ headerName: "公司名称", field: "companyName", tooltipField: 'companyName' },
			{
				headerName: "线下签署",
				field: "signMode",
				cellRendererFramework: operator
			}
		]
	},
	mounted () {
		this.$refs['agGridComponent'].gridOptions.api.setRowData(this.tableData)
	}
}
</script>
<style lang="less">
.m-companyView {
	.m-agTable {
		height: 300px;
		.m-agTableContent {
			.ag-tool-panel {
				// display: none;
			}
			.el-checkbox {
				line-height: 28px;
			}
		}
	}
}
</style>